<template>
  <div style="display: flex;flex-direction: column;align-items: center">
    <div style="margin-top: 18px;margin-left: 18px;align-self: flex-start;cursor: pointer;" @click="goBack()">
      <i class="el-icon-back">返回</i>
    </div>
    <div style="margin: 40px 0"><h1>我的健康记录</h1></div>
    <el-card style="width: 80%">
      <div style="width: 100%;display: flex;flex-direction: row;justify-content: space-around;margin-bottom: 20px">
        <el-button type="primary" icon="el-icon-plus" v-show="user.roleId !== 3" @click="addHealthInfo">添加健康记录</el-button>
      </div>
      <el-table
          :data="tableData"
          style="width: 100%;margin-bottom: 20px">
        <el-table-column
            type="index"
            width="50">
        </el-table-column>
        <el-table-column
            prop="checkYear"
            label="学年"
            width="180">
        </el-table-column>
        <el-table-column
            prop="checkTime"
            label="录入时间"
            width="180">
        </el-table-column>
        <el-table-column
            prop="name"
            label="姓名"
            align="center">
        </el-table-column>
        <el-table-column
            prop="stuNo"
            label="学号"
            width="180">
        </el-table-column>
        <el-table-column
            prop="college"
            align="center"
            label="学院"
            width="180">
        </el-table-column>
        <el-table-column
            prop="major"
            align="center"
            label="专业"
            width="180">
        </el-table-column>
        <el-table-column
            prop="grade"
            label="班级"
            align="center">
        </el-table-column>
        <el-table-column
            fixed="right"
            align="center"
            label="操作"
            width="230">
          <template slot-scope="scope">
            <el-button
                @click.native.prevent="showRow(scope.row)"
                size="small">
              查看
            </el-button>
            <el-button
                v-show="user.roleId !== 3"
                @click.native.prevent="updateRow(scope.$index, tableData)"
                size="small">
              编辑
            </el-button>
            <el-button
                v-show="user.roleId !== 3"
                @click.native.prevent="deleteRow(scope.$index, tableData)"
                size="small">
              删除
            </el-button>
          </template>
        </el-table-column>
      </el-table>
      <div>
        <el-pagination
            style="float: left;margin-bottom: 20px"
            @size-change="handleSizeChange"
            @current-change="handleCurrentChange"
            :current-page="searchData.pageNum"
            :page-sizes="[5, 10, 15, 20]"
            :page-size="searchData.pageSize"
            layout="total, sizes, prev, pager, next, jumper"
            :total="searchData.total">
        </el-pagination>
      </div>
    </el-card>
    <el-dialog :title="title"
               width="80%"
               :modal="false"
               :before-close="handleClose"
               :visible.sync="dialogVisible">
      <div style="width: 100%;display: flex;align-items: center;flex-direction: column">
        <el-form :model="checkInfoData" :rules="rules" ref="checkInfoData" label-width="25%" style="width: 90%;"
                 label-position="left">
          <el-row>
            <el-col :span="8">
              <el-form-item label="选择学年" prop="checkYear">
                <el-select v-model="checkInfoData.checkYear" :disabled="disable"
                           :value="checkInfoData.checkYear">
                  <el-option v-for="item in checkDataOptions" :key="item.label" :label="item.label"
                             :value="item.label"></el-option>
                </el-select>
              </el-form-item>
            </el-col>
            <el-col :span="8">
              <el-form-item label="录入日期" prop="checkTime">
                <el-date-picker v-model="checkInfoData.checkTime" :disabled="disable" type="datetime"></el-date-picker>
              </el-form-item>
            </el-col>
          </el-row>
          <el-alert title="基本信息"
                    type="success"
                    :closable="false" style="margin-bottom: 10px"></el-alert>
          <el-row>
            <el-col :span="24">
              <el-row>
                <el-col :span="8">
                  <el-form-item label="学院" prop="college">
                    <el-input :disabled="disable" v-model="checkInfoData.college"
                              autocomplete="off"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="专业" prop="major">
                    <el-input :disabled="disable" v-model="checkInfoData.major"
                              autocomplete="off"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="班级" prop="grade">
                    <el-input :disabled="disable" v-model="checkInfoData.grade"
                              autocomplete="off"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="学号" prop="stuNo">
                    <el-input :disabled="disable" v-model="checkInfoData.stuNo"
                              autocomplete="off"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="姓名" prop="name">
                    <el-input v-model="checkInfoData.name" :disabled="disable"
                              autocomplete="off"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="性别" prop="sex">
                    <el-radio :disabled="disable" label="男" v-model="checkInfoData.sex"></el-radio>
                    <el-radio :disabled="disable" label="女" v-model="checkInfoData.sex"></el-radio>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="出生" prop="birth">
                    <el-date-picker v-model="checkInfoData.birth" style="width: 100%"
                                    :disabled="disable"></el-date-picker>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="实际年龄" prop="realAge">
                    <el-input type="number" v-model="checkInfoData.realAge"
                              :disabled="disable"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="文化程度" prop="cultureLevel">
                    <el-input v-model="checkInfoData.cultureLevel" :disabled="disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="民族" prop="nation">
                    <el-input v-model="checkInfoData.nation" :disabled="disable"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="职业" prop="occupation">
                    <el-input v-model="checkInfoData.occupation" :disabled="disable"></el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="籍贯" prop="nativePlace">
                    <el-input v-model="checkInfoData.nativePlace" :disabled="disable"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="身高" prop="height"
                                :rules="{required: true, message: '身高不能为空', trigger: 'blur'}">
                    <el-input v-model="checkInfoData.height" @input="getBMI()" type="number">
                      <template slot="append">公分</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="体重" prop="weight"
                                :rules="{required: true, message: '体重不能为空', trigger: 'blur'}">
                    <el-input v-model="checkInfoData.weight" @input="getBMI()" type="number">
                      <template slot="append">公斤</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="BMI" prop="bmiValue">
                    <el-input v-model="checkInfoData.bmiValue" :disabled="true"
                              type="number"></el-input>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>
          </el-row>

          <el-alert title="饮食风格"
                    type="success"
                    :closable="false" style="margin-bottom: 10px"></el-alert>

          <el-row>
            <el-col :span="24">
              <el-row>
                <el-col :span="8">
                  <el-form-item label="主食类">
                    <el-slider v-model="checkInfoData.zhushiLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="肉蛋类">
                    <el-slider v-model="checkInfoData.roudanLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="大豆及制品">
                    <el-slider v-model="checkInfoData.dadouzhipinLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="蔬菜菌藻类">
                    <el-slider v-model="checkInfoData.shucaijunzaoLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="水果类">
                    <el-slider v-model="checkInfoData.shuiguoLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="奶类">
                    <el-slider v-model="checkInfoData.naiyouLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="油脂类">
                    <el-slider v-model="checkInfoData.youzhiLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="坚果类">
                    <el-slider v-model="checkInfoData.jianguoLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="调味品">
                    <el-slider v-model="checkInfoData.tiaoweipinLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
              </el-row>
              <el-row>
                <el-col :span="8">
                  <el-form-item label="饮料类">
                    <el-slider v-model="checkInfoData.yinliaoLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="零食及冷饮">
                    <el-slider v-model="checkInfoData.lingshilengyinLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
                <el-col :span="8">
                  <el-form-item label="其他">
                    <el-slider v-model="checkInfoData.qitaLei" show-input></el-slider>
                  </el-form-item>
                </el-col>
              </el-row>
            </el-col>
          </el-row>

          <el-alert title="运动情况"
                    type="success"
                    :closable="false" style="margin-bottom: 10px"></el-alert>
          <el-row>
            <el-col :span="24">
              <el-row v-for="(domain,index) in checkInfoData.dynamicYunDongDatas">
                <el-col :span="5">
                  <el-form-item label="运动方式" label-width="100px"
                                :key="`yundongFangshi`+ index"
                                :prop="'dynamicYunDongDatas.' + index + '.yundongFangshi'">
                    <el-select placeholder="请选择" v-model="domain.yundongFangshi">
                      <el-option
                          v-for="item in yunDongOptions"
                          :key="item.value"
                          :label="item.label"
                          :value="item.value"
                          :disabled="item.disabled">
                      </el-option>
                    </el-select>
                  </el-form-item>
                </el-col>
                <el-col :span="5">
                  <el-form-item label="运动时长" label-width="100px"
                                :key="`yundongTime`+ index"
                                :prop="'dynamicYunDongDatas.' + index + '.yundongTime'">
                    <el-input type="number" v-model="domain.yundongTime" @input="getPower(domain)">
                      <template slot="append">小时</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="6">
                  <el-form-item label="大约消耗热量" label-width="150px"
                                :key="`xiaohaoReliang` + index"
                                :prop="'dynamicYunDongDatas.' + index + '.xiaohaoReliang'">
                    <el-input type="number" v-model="domain.xiaohaoReliang">
                      <template slot="append">千卡</template>
                    </el-input>
                  </el-form-item>
                </el-col>
                <el-col :span="5" style="margin-left: 10px">
                  <el-button v-if="index > 0 || checkInfoData.dynamicYunDongDatas.length > 1"
                             type="success" icon="el-icon-remove-outline" circle
                             @click="removeDomain(domain)"></el-button>
                  <el-button v-if="index == checkInfoData.dynamicYunDongDatas.length-1"
                             icon="el-icon-circle-plus-outline" circle
                             @click="addDomain()"></el-button>
                </el-col>
              </el-row>
            </el-col>
          </el-row>

          <!-- region -->

<!--          <el-alert title="五官科检查信息&#45;&#45;眼科"-->
<!--                    type="warning"-->
<!--                    :closable="false" style="margin-bottom: 10px"></el-alert>-->
<!--          <el-row>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="视力-左" prop="leftView">-->
<!--                <el-input type="number" v-model="checkInfoData.leftView"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="视力-右" prop="rightView">-->
<!--                <el-input type="number" v-model="checkInfoData.rightView"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="矫正视力-左" label-width="30%" prop="correctLeftView">-->
<!--                <el-input type="number" v-model="checkInfoData.correctLeftView"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="矫正视力-右" label-width="30%" prop="correctRightView">-->
<!--                <el-input type="number" v-model="checkInfoData.correctRightView"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-form-item label="其他眼疾" label-width="10%">-->
<!--            <el-input v-model="checkInfoData.otherEyesSick"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-row>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="色觉检查-彩色图案及编码" label-width="30%">-->
<!--                <el-input v-model="checkInfoData.colorOrCode"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="色觉检查-单色识别" label-width="30%">-->
<!--                <el-input v-model="checkInfoData.singleColorJudge"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->

<!--          <el-alert title="五官科检查信息&#45;&#45;耳喉鼻科"-->
<!--                    type="warning"-->
<!--                    :closable="false" style="margin-bottom: 10px"></el-alert>-->
<!--          <el-row>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="听力-左" prop="leftAudition">-->
<!--                <el-input type="number" v-model="checkInfoData.leftAudition">-->
<!--                  <template slot="append">公尺</template>-->
<!--                </el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="听力-右" prop="rightAudition">-->
<!--                <el-input type="number" v-model="checkInfoData.rightAudition">-->
<!--                  <template slot="append">公尺</template>-->
<!--                </el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-form-item label="耳疾" label-width="10%">-->
<!--            <el-input v-model="checkInfoData.earSick"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-row>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="嗅觉">-->
<!--                <el-input v-model="checkInfoData.smell"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="鼻及鼻窦疾病">-->
<!--                <el-input v-model="checkInfoData.paranasalSinus"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-row>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="咽喉">-->
<!--                <el-input v-model="checkInfoData.throat"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="口吃">-->
<!--                <el-input v-model="checkInfoData.stammer"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->


<!--          <el-alert title="五官科检查信息&#45;&#45;口腔科"-->
<!--                    type="warning"-->
<!--                    :closable="false" style="margin-bottom: 10px"></el-alert>-->
<!--          <el-row>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="龋  齿">-->
<!--                <el-input v-model="checkInfoData.toothSick"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="缺  齿">-->
<!--                <el-input v-model="checkInfoData.hypodontia"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="齿  槽">-->
<!--                <el-input v-model="checkInfoData.toothPlace"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-form-item label="其他" label-width="10%">-->
<!--            <el-input v-model="checkInfoData.otherSenseSick"></el-input>-->
<!--          </el-form-item>-->

<!--          <el-alert title="外科检查信息"-->
<!--                    type="info"-->
<!--                    :closable="false" style="margin-bottom: 10px"></el-alert>-->
<!--          <el-row>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="身长">-->
<!--                <el-input v-model="checkInfoData.height" type="number">-->
<!--                  <template slot="append">公分</template>-->
<!--                </el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="体重">-->
<!--                <el-input v-model="checkInfoData.weight" type="number">-->
<!--                  <template slot="append">公斤</template>-->
<!--                </el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="腰围">-->
<!--                <el-input v-model="checkInfoData.waistline" type="number">-->
<!--                  <template slot="append">公分</template>-->
<!--                </el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="6">-->
<!--              <el-form-item label="皮肤">-->
<!--                <el-input v-model="checkInfoData.skin"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-row>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="淋巴">-->
<!--                <el-input v-model="checkInfoData.lymph"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="甲状腺">-->
<!--                <el-input v-model="checkInfoData.glandulaThyroidea"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="脊  柱">-->
<!--                <el-input v-model="checkInfoData.spineBackbone"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-row>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="四肢">-->
<!--                <el-input v-model="checkInfoData.allLegs"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="关  节">-->
<!--                <el-input v-model="checkInfoData.arthrosis"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="8">-->
<!--              <el-form-item label="平  足">-->
<!--                <el-input v-model="checkInfoData.foot"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-form-item label="其他" label-width="10%">-->
<!--            <el-input v-model="checkInfoData.otherSurgerySick"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-row>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="血压">-->
<!--                <el-input type="number" v-model="checkInfoData.bloodPressure">-->
<!--                  <template slot="append">mmHg</template>-->
<!--                </el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="脉搏">-->
<!--                <el-input type="number" v-model="checkInfoData.pulse">-->
<!--                  <template slot="append">次/秒</template>-->
<!--                </el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->


<!--          <el-alert title="内科检查信息"-->
<!--                    type="info"-->
<!--                    :closable="false" style="margin-bottom: 10px"></el-alert>-->
<!--          <el-form-item label="发育营养" label-width="10%">-->
<!--            <el-input v-model="checkInfoData.growth"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="神经及精神" label-width="10%">-->
<!--            <el-input v-model="checkInfoData.mind"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="肺及呼吸道" label-width="10%">-->
<!--            <el-input v-model="checkInfoData.lung"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="心脏及血管" label-width="10%">-->
<!--            <el-input v-model="checkInfoData.heart"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-row>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="腹部器官-肝" label-width="20%">-->
<!--                <el-input v-model="checkInfoData.liver"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--            <el-col :span="12">-->
<!--              <el-form-item label="腹部器官-脾" label-width="20%">-->
<!--                <el-input v-model="checkInfoData.spleen"></el-input>-->
<!--              </el-form-item>-->
<!--            </el-col>-->
<!--          </el-row>-->
<!--          <el-form-item label="其他" label-width="10%">-->
<!--            <el-input v-model="checkInfoData.otherInternalSick"></el-input>-->
<!--          </el-form-item>-->


<!--          <el-alert title="化验检查信息"-->
<!--                    type="success"-->
<!--                    :closable="false" style="margin-bottom: 10px"></el-alert>-->
<!--          <el-form-item label="化验检查" label-width="10%">-->
<!--            <el-input type="textarea" v-model="checkInfoData.assayCheck"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-alert title="化验胸部放射检查信息"-->
<!--                    type="success"-->
<!--                    :closable="false" style="margin-bottom: 10px"></el-alert>-->
<!--          <el-form-item label="化验胸部放射检查" label-width="10%">-->
<!--            <el-input type="textarea" v-model="checkInfoData.chestCheck"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-alert title="其他检查信息"-->
<!--                    type="success"-->
<!--                    :closable="false" style="margin-bottom: 10px"></el-alert>-->
<!--          <el-form-item label="其他检查" label-width="10%">-->
<!--            <el-input type="textarea" v-model="checkInfoData.otherCheck"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="检查结论" label-width="10%">-->
<!--            <el-input type="textarea" v-model="checkInfoData.checkResult"></el-input>-->
<!--          </el-form-item>-->
<!--          <el-form-item label="备注" label-width="10%">-->
<!--            <el-input type="textarea" v-model="checkInfoData.remark"></el-input>-->
<!--          </el-form-item>-->
<!--endregion -->
          <template>
            <el-form-item align="right" v-show="!disable">
              <!--                            <el-button type="success" @click="disable=false">编辑</el-button>-->
              <el-button :disabled="disable" type="primary" @click="saveData(checkInfoData)">保存
              </el-button>
              <el-button @click="handleClose">取消</el-button>
            </el-form-item>
          </template>
        </el-form>
      </div>

    </el-dialog>
    <el-dialog title="查看学生健康档案"
               width="80%"
               :modal="false"
               :before-close="handleClose"
               :visible.sync="dialogShowVisible">
      <health-table :health-data="checkInfoData" :is-msg="false" :disabled="disable"
                    @save-suggestion="saveSuggestion"></health-table>
    </el-dialog>
  </div>
</template>

<script>
import Message from '../../components/messages/index.js'
import HealthTable from './HeallthTable'

export default {
  name: "index",

  data() {
    return {
      dialogShowVisible: false,
      dialogVisible: false,
      tableData: [],
      searchData: {
        pageSize: 5,
        pageNum: 1,
        total: 0,
        clauses: [
          {
            column: "userId",
            operation: "=",
            value: ""
          }]
      },
      checkInfoData: {
        id: "",
        createDatetime: "",
        updateDatetime: "",
        allLegs: "",
        arthrosis: "",
        assayCheck: "",
        birth: "",
        bloodPressure: 0,
        checkResult: "",
        checkTime: "",
        chestCheck: "",
        college: "",
        colorOrCode: "",
        correctLeftView: "",
        correctRightView: "",
        cultureLevel: "",
        earSick: "",
        foot: "",
        glandulaThyroidea: "",
        grade: "",
        growth: "",
        heart: "",
        height: 0,
        historyCheck: "",
        hypodontia: "",
        leftAudition: "",
        leftView: "",
        liver: "",
        lung: "",
        lymph: "",
        major: "",
        mind: "",
        name: "",
        nation: "",
        nativePlace: "",
        occupation: "",
        otherCheck: "",
        otherEyesSick: "",
        otherInternalSick: "",
        otherSenseSick: "",
        otherSurgerySick: "",
        paranasalSinus: "",
        photo: "",
        presentAddress: "",
        pulse: 0,
        realAge: 0,
        remark: "",
        rightAudition: "",
        rightView: "",
        sealer: "",
        sex: "",
        signForAssay: "",
        signForChest: "",
        signForEar: "",
        signForEyes: "",
        signForInternal: "",
        signForMouth: "",
        signForResult: "",
        signForSurgery: "",
        singleColorJudge: "",
        skin: "",
        smell: "",
        spineBackbone: "",
        spleen: "",
        stammer: "",
        stuNo: "",
        suggestForCheck: "",
        throat: "",
        toothPlace: "",
        toothSick: "",
        userId: "",
        waistline: 0,
        weight: 0,
        workPlace: "",
        checkYear: "",
        YinshiStyle: "",
        yundongJuli: "",
        yundongTime: "",
        yundongFangshi: "",
        xiaohaoReliang: "",
        bmiValue: 0,
        zhushiLei: 0,
        roudanLei: 0,
        dadouzhipinLei: 0,
        shucaijunzaoLei: 0,
        shuiguoLei: 0,
        naiyouLei: 0,
        youzhiLei: 0,
        jianguoLei: 0,
        tiaoweipinLei: 0,
        yinliaoLei: 0,
        lingshilengyinLei: 0,
        qitaLei: 0,
        dynamicYunDongDatas: [{
          yundongFangshi: "",
          yundongTime: "",
          xiaohaoReliang: ""
        }],
        bmrValue:"",
        breakfast:"",
        lunch:"",
        dinner:""
      },
      disable: true,
      title: "添加用户",
      userOptions: [],
      rules: {
        checkTime: [
          {required: true, message: '请选择录入日期', trigger: 'blur'}
        ],
        checkYear: [
          {required: true, message: '请选择学年', trigger: 'blur'}
        ],
        userId: [
          {required: true, message: '请选择学生', trigger: 'blur'}
        ],
        college: [
          {required: true, message: '请输入学院', trigger: 'blur'}
        ],
        major: [
          {required: true, message: '请输入专业', trigger: 'blur'}
        ],
        grade: [
          {required: true, message: '请输入班级', trigger: 'blur'}
        ],
        stuNo: [
          {required: true, message: '请输入学号', trigger: 'blur'}
        ],
        name: [
          {required: true, message: '请输入姓名', trigger: 'blur'}
        ],

      },
      checkDataOptions: [
        {label: "第一学年"}, {label: "第二学年"}, {label: "第三学年"}, {label: "第四学年"}
      ],
      user: JSON.parse(localStorage.getItem("user")),
      yunDongOptions: [{
        value: 'jingzuo',
        label: '静坐',
        disabled: false
      }, {
        value: 'buxing',
        label: '步行',
        disabled: false
      }, {
        value: 'qiche',
        label: '骑车',
        disabled: false
      }, {
        value: 'youyong',
        label: '游泳',
        disabled: false
      }, {
        value: 'paobu',
        label: '跑步',
        disabled: false
      }, {
        value: 'yumaoqiu',
        label: '羽毛球',
        disabled: false
      }, {
        value: 'yujia',
        label: '瑜伽',
        disabled: false
      }, {
        value: 'juzhong',
        label: '举重',
        disabled: false
      }, {
        value: 'zuqiu',
        label: '足球',
        disabled: false
      },{
        value: 'qita',
        label: '其他',
        disabled: false
      }
      ]
    }
  },
  components: {HealthTable},
  methods: {
    goBack(){
      window.history.back()
    },
    removeDomain(item) {
      for (let i = 0; i < this.yunDongOptions.length; i++) {
        if(item.yundongFangshi == this.yunDongOptions[i].value){
          this.yunDongOptions[i].disabled = false;
        }
      }
      var index = this.checkInfoData.dynamicYunDongDatas.indexOf(item)
      if (index !== -1) {
        this.checkInfoData.dynamicYunDongDatas.splice(index, 1)
      }
    },
    addDomain() {
      for (let i = 0; i < this.checkInfoData.dynamicYunDongDatas.length; i++) {
        let data = this.checkInfoData.dynamicYunDongDatas[i];
        for (let i = 0; i < this.yunDongOptions.length; i++) {
          if(data.yundongFangshi == this.yunDongOptions[i].value){
            this.yunDongOptions[i].disabled = true;
          }
        }
      }
      this.checkInfoData.dynamicYunDongDatas.push({
        yundongFangshi: "",
        yundongTime: "",
        xiaohaoReliang: ""
      });
    },
    getPower(data) {
      if (!this.checkInfoData.weight) {
        data.yundongTime = "";
        this.$message.error('体重信息未录入');
        return;
      }
      if (data.yundongFangshi && data.yundongTime) {
        //静坐：1.0 MET
        // 步行（3.2公里/小时）：3.5 MET
        // 骑自行车（16-19公里/小时）：8-10 MET
        // 游泳（快速爬泳）：10 MET
        // 跑步（10公里/小时）：10 MET
        // 羽毛球：7 MET
        // 瑜伽：2-3 MET
        // 举重：6 MET
        // 足球：7-10 MET
        let metValue = 1;
        if (data.yundongFangshi == "jingzuo") {
          metValue = 1;
        } else if (data.yundongFangshi == "buxing") {
          metValue = 3.5;
        } else if (data.yundongFangshi == "qiche") {
          metValue = 8;
        } else if (data.yundongFangshi == "buxing") {
          metValue = 3.5;
        } else if (data.yundongFangshi == "youyong") {
          metValue = 10;
        } else if (data.yundongFangshi == "paobu") {
          metValue = 10;
        } else if (data.yundongFangshi == "yumaoqiu") {
          metValue = 7;
        } else if (data.yundongFangshi == "juzhong") {
          metValue = 2.5;
        } else if (data.yundongFangshi == "zuqiu") {
          metValue = 8.5;
        }else{
          metValue = 5;
        }
        data.xiaohaoReliang = this.checkInfoData.weight * data.yundongTime * metValue;
      }
    },
    getBMI() {
      if (this.checkInfoData.height && this.checkInfoData.weight) {
        var heigth = this.checkInfoData.height / 100;
        var weight = this.checkInfoData.weight;
        let bmi = weight / (heigth * heigth);
        this.checkInfoData.bmiValue = bmi.toFixed(2)
      } else {
        this.checkInfoData.bmiValue = 0
      }
    },
    handleClose() {
      this.dialogVisible = false;
      this.dialogShowVisible = false;
      this.initData();
    },
    initData() {
      this.searchData.clauses[0].value = this.user.id;
      this.$http.post("/checkInfo/page", this.searchData).then(res => {
        if (res.status === 200) {
          console.log("我的健康档案数据", res)
          this.tableData = res.data.records;
          this.searchData.total = res.data.total;
        }
      })
      this.checkInfoData = Object.assign({}, {

        id: "",
        createDatetime: "",
        updateDatetime: "",
        allLegs: "",
        arthrosis: "",
        assayCheck: "",
        birth: "",
        bloodPressure: 0,
        checkResult: "",
        checkTime: "",
        chestCheck: "",
        college: "",
        colorOrCode: "",
        correctLeftView: "",
        correctRightView: "",
        cultureLevel: "",
        earSick: "",
        foot: "",
        glandulaThyroidea: "",
        grade: "",
        growth: "",
        heart: "",
        height: 0,
        historyCheck: "",
        hypodontia: "",
        leftAudition: "",
        leftView: "",
        liver: "",
        lung: "",
        lymph: "",
        major: "",
        mind: "",
        name: "",
        nation: "",
        nativePlace: "",
        occupation: "",
        otherCheck: "",
        otherEyesSick: "",
        otherInternalSick: "",
        otherSenseSick: "",
        otherSurgerySick: "",
        paranasalSinus: "",
        photo: "",
        presentAddress: "",
        pulse: 0,
        realAge: 0,
        remark: "",
        rightAudition: "",
        rightView: "",
        sealer: "",
        sex: "",
        signForAssay: "",
        signForChest: "",
        signForEar: "",
        signForEyes: "",
        signForInternal: "",
        signForMouth: "",
        signForResult: "",
        signForSurgery: "",
        singleColorJudge: "",
        skin: "",
        smell: "",
        spineBackbone: "",
        spleen: "",
        stammer: "",
        stuNo: "",
        suggestForCheck: "",
        throat: "",
        toothPlace: "",
        toothSick: "",
        userId: "",
        waistline: 0,
        weight: 0,
        workPlace: "",
        checkYear: "",
        YinshiStyle: "",
        yundongJuli: "",
        yundongTime: "",
        yundongFangshi: "",
        xiaohaoReliang: "",
        bmiValue: 0,
        zhushiLei: 0,
        roudanLei: 0,
        dadouzhipinLei: 0,
        shucaijunzaoLei: 0,
        shuiguoLei: 0,
        naiyouLei: 0,
        youzhiLei: 0,
        jianguoLei: 0,
        tiaoweipinLei: 0,
        yinliaoLei: 0,
        lingshilengyinLei: 0,
        qitaLei: 0,
        dynamicYunDongDatas: [{
          yundongFangshi: "",
          yundongTime: "",
          xiaohaoReliang: ""
        }]
      })
    },
    handleSizeChange(val) {
      this.searchData.pageSize = val;
      this.initData();
    },
    handleCurrentChange(val) {
      this.searchData.pageNum = val;
      this.initData();
    },
    addHealthInfo() {
      this.title = "添加健康档案";
      for (let i = 0; i < this.yunDongOptions.length; i++) {
        this.yunDongOptions[i].disabled = false;
      }
      this.checkInfoData.college = this.user.college;
      this.checkInfoData.major = this.user.major;
      this.checkInfoData.grade = this.user.grade;
      this.checkInfoData.stuNo = this.user.stuNo;
      this.checkInfoData.name = this.user.name;
      this.checkInfoData.sex = this.user.sex;
      this.checkInfoData.birth = this.user.birth;
      this.checkInfoData.realAge = this.user.realAge;
      this.checkInfoData.cultureLevel = this.user.cultureLevel;
      this.checkInfoData.nation = this.user.nation;
      this.checkInfoData.occupation = this.user.occupation;
      this.checkInfoData.nativePlace = this.user.nativePlace;
      this.checkInfoData.presentAddress = this.user.presentAddress;
      this.checkInfoData.workPlace = this.user.workPlace;
      this.checkInfoData.teacherId = this.user.teacherId;
      this.checkInfoData.photo = this.user.photo;
      this.checkInfoData.bmiValue = 0;
      this.dialogVisible = true;
      this.disable = false;
    },
    showRow(data) {
      this.disable = true;
      this.checkInfoData = data;
      this.checkInfoData.birth = this.checkInfoData.birth.substring(0,10)
      this.dialogShowVisible = true;
    },
    updateRow(index, data) {
      this.title = "编辑健康档案";
      this.disable = false;
      this.$http.get("/checkInfo/get/" + data[index].id).then(res => {
        if (res.status === 200) {
          this.checkInfoData = Object.assign({}, this.checkInfoData, res.data);
          if (this.checkInfoData.xiaohaoReliang && this.checkInfoData.xiaohaoReliang.length > 0) {
            let yundongFangshiArr = this.checkInfoData.yundongFangshi.split(",");
            let yundongTimeArr = this.checkInfoData.yundongTime.split(",");
            let xiaohaoReliangArr = this.checkInfoData.xiaohaoReliang.split(",");
            this.checkInfoData.dynamicYunDongDatas = [];
            for (let i = 0; i < yundongFangshiArr.length; i++) {
              this.checkInfoData.dynamicYunDongDatas.push({
                yundongFangshi: yundongFangshiArr[i] + "",
                yundongTime: yundongTimeArr[i] + "",
                xiaohaoReliang: xiaohaoReliangArr[i] + ""
              })
            }
          }
          this.checkInfoData.xiaohaoReliang = ""
          this.checkInfoData.yundongFangshi = ""
          this.checkInfoData.yundongTime = ""
          this.dialogVisible = true;
        }
      })
    },
    deleteRow(index, data) {
      Message.confirm("是否删除该档案?").then(() => {
        this.$http.get("/checkInfo/delete/" + data[index].id).then(res => {
          if (res.status === 200) {
            Message.success("操作成功");
            this.initData();
          }
        })
      })
    },
    updateUserInfo(){
      const updateUserData = {};
      updateUserData.id = this.user.id;
      updateUserData.sex = this.checkInfoData.sex;
      updateUserData.cultureLevel = this.checkInfoData.cultureLevel;
      updateUserData.nation = this.checkInfoData.nation;
      updateUserData.nativePlace = this.checkInfoData.nativePlace;
      updateUserData.occupation = this.checkInfoData.occupation;
      updateUserData.presentAddress = this.checkInfoData.presentAddress;
      updateUserData.workPlace = this.checkInfoData.workPlace;
      updateUserData.realAge = this.checkInfoData.realAge;
      updateUserData.password = this.user.password;
      updateUserData.birth = this.checkInfoData.birth;
      updateUserData.college = this.checkInfoData.college;
      updateUserData.grade = this.checkInfoData.grade;
      updateUserData.major = this.checkInfoData.major;

      this.$http.post("/user/updateUser",updateUserData).then((res)=>{
        if(res.status === 200){
          Message.success("用户信息同步更新成功！")
        }
      })
    },
    saveData() {
      if (!this.checkInfoData.weight || !this.checkInfoData.height || !this.checkInfoData.checkYear || !this.checkInfoData.checkTime) {
        this.$message.error("数据未填写完整！");
        return;
      }
      for (let i = 0; i < this.checkInfoData.dynamicYunDongDatas.length; i++) {
        let data = this.checkInfoData.dynamicYunDongDatas[i];
        if (this.checkInfoData.yundongFangshi && this.checkInfoData.yundongFangshi.length > 0) {
          this.checkInfoData.yundongFangshi = this.checkInfoData.yundongFangshi + "," + data.yundongFangshi;
        } else {
          this.checkInfoData.yundongFangshi = data.yundongFangshi;
        }
        if (this.checkInfoData.yundongTime && this.checkInfoData.yundongTime.length > 0) {
          this.checkInfoData.yundongTime = this.checkInfoData.yundongTime + "," + data.yundongTime;
        } else {
          this.checkInfoData.yundongTime = data.yundongTime;
        }
        if (this.checkInfoData.xiaohaoReliang && this.checkInfoData.xiaohaoReliang.length > 0) {
          this.checkInfoData.xiaohaoReliang = this.checkInfoData.xiaohaoReliang + "," + data.xiaohaoReliang;
        } else {
          this.checkInfoData.xiaohaoReliang = data.xiaohaoReliang + ""
        }
      }
      this.checkInfoData.checkTime = this.$moment(this.checkInfoData.checkTime).format("YYYY-MM-DD HH:mm:ss");
      if (this.checkInfoData.id == null || this.checkInfoData.id === "") {
        this.checkInfoData.userId = this.user.id;
        this.$http.post("/checkInfo/add", this.checkInfoData).then(res => {
          if (res.status === 200) {
            Message.success("操作成功");
            this.initData();
          }
        })
      } else {
        console.log("更新");
        this.$http.post("/checkInfo/update", this.checkInfoData).then(res => {
          if (res.status === 200) {
            Message.success("操作成功");
            this.initData();
          }
        })
      }
      this.updateUserInfo();
      this.dialogVisible = false;
    },
    getAllUser() {
      this.$http.get("/user/getAllStudent/2").then(res => {
        if (res.status === 200) {
          this.userOptions = res.data;
        }
      })
    },
    // judgeCheckIsExist() {
    //     if (this.checkInfoData.checkYear === "" || this.checkInfoData.checkYear == null) {
    //         this.$message.warning("请选择需要学年")
    //     } else {
    //         this.$http.get("/checkInfo/judgeCheckIsExist", {
    //             params: {
    //                 "userId": this.user.id,
    //                 "checkYear": this.checkInfoData.checkYear
    //             }
    //         }).then(res => {
    //             if (res.status === 200) {
    //                 if (res.data === false) {
    //                     this.$message.error("该学生此学年体检单已存在，请重新选择学年!")
    //                 }
    //             }
    //         })
    //     }
    // },
    saveSuggestion(data) {
      this.$http.post("/suggestion/add", data).then(res => {
        if (res.status === 200) {
          this.$message.success("留言成功");
          this.dialogShowVisible = false;
        }
      })
    }
  },
  mounted() {
    this.initData();
    this.getAllUser();
  }
}
</script>

<style scoped>
.el-form-item.is-required:not(.is-no-asterisk) > .el-form-item__label:before {
  margin-right: 0;
}
</style>
